<template>
  <div class="sos">
    <img :src="img" alt="">
    <p class="sos-content">糟糕，页面飞走了~</p>
    <p class="sos-btn">
      <a href="/home">返回首页</a>
    </p>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        img: require('assets/404_feiji@3x.png')
      }
    }
  }
</script>

<style lang='scss'>
  @import '../../common/scss/_variable.scss';

  .sos {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding-top: 184px;
    text-align: center;
    img {
      width: 534px;
      height: 313px;
    }
    &-content {
      font-size: 38px;
      color: $base-ff6c00;
      margin: 74px 0 70px 0;
    }
    &-btn {
      a {
        display: inline-block;
        width: 250px;
        height: 66px;
        border-radius: 6px;
        line-height: 70px;
        background: $base-ff6c00;
        color: $base-fff;
        font-size: 32px;
      }
    }
  }
</style>
